﻿@model List<Models.Entity.Donate>
@using Common

@{
    ViewBag.Title = "网站捐赠";
    Layout = "~/Views/Shared/_Layout.cshtml";
    Random r = new Random();
}
<style>
    .bg-title {
        height: 50vh;
        max-height: 400px;
        position: relative;
        background: url(/Content/images/@(r.Next(1,9)).jpg) no-repeat center;
        background-size:cover;
        background-attachment: fixed;
    }
    .flex-box {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
        height: 100%;
    }
    .flex-box>div{
        margin: 0 15px;
        width: 18%;
    }
    @@media only screen and (max-width: 1080px) {
        .flex-box>div{
            width: 29.8%;
        }
    }
</style>
<script src="https://cdn.bootcss.com/angular.js/1.6.9/angular.min.js"></script>
<script src="~/Scripts/tm.pagination.js"></script>
<script src="~/Scripts/ng-table.min.js"></script>
<ol class="cd-breadcrumb triangle">
    <li>@Html.ActionLink("首页", "Index", "Home")</li>
    <li class="current"><em>@ViewBag.Title</em></li>
</ol>
<div class="bg-title">
    <div class="header-content text-center">
        <h1 class="size48">
            喜欢我的作品和文章？
        </h1>
        <div class="divider"></div>
        <p class="size24">
            您的捐助就是给我最大的鼓励
        </p>
    </div>
</div>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-3">
            <div class="page-header margin-clear margin-top10">
                <h2 class="size28">
                    支付宝二维码
                </h2>
            </div>
            <img class="img-responsive img-thumbnail" style="width: 100%" src="@CommonHelper.GetSettings("Donate")" />
        </div>
        <div class="col-md-3">
            <div class="page-header margin-clear margin-top10">
                <h2 class="size28">
                    微信二维码
                </h2>
            </div>
            <img class="img-responsive img-thumbnail" style="width: 100%" src="@CommonHelper.GetSettings("DonateWechat")" />
            <div class="protected">
                <span class="text-red size20">注意：微信无法看见支付人的名称，所以捐赠时最好附上完整个人信息，否则无法将您加入到赞助名单中。</span>
            </div>
        </div>
        <div class="col-md-3">
            <div class="page-header margin-clear margin-top10">
                <h2 class="size28">
                    QQ二维码
                </h2>
            </div>
            <img class="img-responsive img-thumbnail" style="width: 100%" src="@CommonHelper.GetSettings("DonateQQ")" />
        </div>
        <div class="col-md-3">
            <div class="page-header margin-clear margin-top10">
                <h2 class="size28">
                    京东金融收钱码
                </h2>
            </div>
            <img class="img-responsive img-thumbnail" style="width: 100%" src="@CommonHelper.GetSettings("DonateJingdong")" />
        </div>
        <div class="col-md-3">
            <div class="page-header margin-clear margin-top10">
                <h2 class="size28">
                    支付宝，领红包
                </h2>
            </div>
            <img class="img-responsive img-thumbnail" style="width: 100%" src="http://wx1.sinaimg.cn/mw690/0060lm7Tly1fsnrd1z8shj31kw26ugsz.jpg" />
        </div>
    </div>
</div>
<div class="container margintop20">
    <div class="text-green size20" style="line-height: 26px;">
        <p>
            本网站由博主一个人打造，开发和运营均为博主本人，如果您是真心喜欢本博客，您可以对博主表示一下感谢，以支持后期发布更多好资源，5毛也好、1元也罢，都是你们的心意。网站运营也需要成本，有你的援助，一切会更好。
        </p>
        <p class="text-red size20">
            捐赠时最好能够附上你的完整信息，包括：您的昵称或真名、邮箱地址、QQ或微信、金额等；因为不能保证能够完全的清楚捐赠者的基本信息，如果你完成了捐赠，推荐你在网站留言板备注一下，或者QQ私信告知你是谁。
        </p>
        <p>
            您可以尽您所能地捐赠，如果您临时改变主意，您可以在事后一个月之内联系作者申请退款！
        </p>
        <p>
            本站的宗旨是：互联网分享精神，乐于发现，勤于分享；
        </p>
        <p>
            我希望的：您将我的网站告诉你的朋友，让更多的人来这里学习，共同进步。
        </p>
    </div>
</div>
<div class="container-fluid margin-bot10 margin-top10">
    <p class="text-green size32 margin-bot10">
        或者，你也可以支持一下我们的淘宝店铺：<a href="https://s.click.taobao.com/t?e=m%3D2%26s%3DYIbUCxulJ3gcQipKwQzePDAVflQIoZepLKpWJ%2Bin0XJRAdhuF14FMa7N6xi2QcXFxq3IhSJN6GQlfCNE0Wdq6XtP1cOahtZYrdRFwJ8cqHqs6R1%2FzVfiiCagbqoBMncPjN7%2FRdU5OLrGJe8N%2FwNpGw%3D%3D" target="_blank">品乐外设</a>，主打游戏级的耳机，机械键盘和鼠标。
    </p>
    <a href="https://s.click.taobao.com/t?e=m%3D2%26s%3DYIbUCxulJ3gcQipKwQzePDAVflQIoZepLKpWJ%2Bin0XJRAdhuF14FMa7N6xi2QcXFxq3IhSJN6GQlfCNE0Wdq6XtP1cOahtZYrdRFwJ8cqHqs6R1%2FzVfiiCagbqoBMncPjN7%2FRdU5OLrGJe8N%2FwNpGw%3D%3D" target="_blank"><img src="https://gdp.alicdn.com/imgextra/i2/2110967145/TB2HElEjgZC2uNjSZFnXXaxZpXa_!!2110967145.jpg" /></a>
</div>
<div class="container-fluid" ng-app="myApp" ng-controller="home as list">
    <div class="page-header margin-clear">
        <h2 class="size24">
            捐赠名单(排名不分先后)：
        </h2>
    </div>
    <table ng-cloak ng-table="list.tableParams" class="table table-bordered table-hover table-condensed margin-clear" ng-form="list.tableForm" disable-filter="list.isAdding" tracked-table="list.tableTracker" style="margin: 0">
        <tr ng-repeat="row in $data" ng-form="rowForm" tracked-table-row="row">
            <td title="'捐赠时间'" sortable="'DonateTime'">
                {{row.DonateTime|date:'yyyy-MM-dd'}}
            </td>
            <td title="'昵称'" sortable="'NickName'">
                {{row.NickName}}
            </td>
            <td title="'邮箱'" sortable="'Email'">
                {{row.EmailDisplay}}
            </td>
            <td title="'QQ或微信'" sortable="'QQorWechat'">
                {{row.QQorWechatDisplay}}
            </td>
            <td title="'金额'" sortable="'Amount'">
                {{row.Amount}}
            </td>
            <td title="'捐赠方式'" sortable="'Via'">
                {{row.Via}}
            </td>
        </tr>
    </table>
    <tm-pagination conf="paginationConf"></tm-pagination>
</div>
<!--PC和WAP自适应版-->
<div id="SOHUCS" sid="donate"></div>
<script type="text/javascript">
(function() {
	var appid = 'cytsT3QgK';
	var conf = 'prod_0358240040a6c9611add9de991099d42';
	var width = window.innerWidth || document.documentElement.clientWidth;
	if (width < 960) {
		window.document.write(
			'<script id="changyan_mobile_js" charset="utf-8" type="text/javascript" src="https://changyan.sohu.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' +
			appid + '&conf=' + conf + '"><\/script>');
	} else {
		var loadJs = function(d, a) {
			var c = document.getElementsByTagName("head")[0] || document.head || document.documentElement;
			var b = document.createElement("script");
			b.setAttribute("type", "text/javascript");
			b.setAttribute("charset", "UTF-8");
			b.setAttribute("src", d);
			if (typeof a === "function") {
				if (window.attachEvent) {
					b.onreadystatechange = function() {
						var e = b.readyState;
						if (e === "loaded" || e === "complete") {
							b.onreadystatechange = null;
							a()
						}
					}
				} else {
					b.onload = a
				}
			}
			c.appendChild(b)
		};
		loadJs("https://changyan.sohu.com/upload/changyan.js", function() {
			window.changyan.api.config({
				appid: appid,
				conf: conf
			})
		});
	}
})();
</script>
<script>
angular.module('myApp', ["ngTable", "tm.pagination"]).controller("home", ["$scope", "$http", "NgTableParams", function ($scope, $http, NgTableParams) {
    var self = this;
    $scope.paginationConf = {
        currentPage: 1,
        itemsPerPage: 10,
        pagesLength: 15,
        perPageOptions: [10, 15, 20, 30, 50, 100],
        rememberPerPage: 'perPageItems',
        onChange: function () {
            window.loading();
            $http.post("/DonateList", {
                page: $scope.paginationConf.currentPage,
                size: $scope.paginationConf.itemsPerPage
            }).then(function (res) {
                $scope.paginationConf.totalItems = res.data.TotalCount;
                $("div[ng-table-pagination]").remove();
                self.tableParams = new NgTableParams({
                    count: 50000
                }, {
                        filterDelay: 0,
                        dataset: res.data.Data
                    });
                window.loadingDone();
            });
        }
    };
}]);
</script>